/**
 * Author: 冯亮亮
 * Remark: 采购计划
 */
lyfdefine(['echarts', 'time-line', 'common/scm-plan-common-choosegoods'], function (echarts, time, scmPlanCommonChoosegoods) {
    return ({
            data: function () {
                return {
                    chooseGoodsDialog: false,
                    tableData: [],
                    dataList: [],
                    dialogVisible: false,
                    echartsLoading: false,
                    dialogFormVisible: false,
                    value10: true,
                    activeStep: 1,
                    cancelBtnText: '取消',
                    importErrInfo: '',
                    fileList: [],
                    value1: '',
                    infor: {},
                    updateFrom: [],
                    dateArr: [],
                    lastQtyList: [],
                    pickerOptions: {
                        shortcuts: [{
                            text: '最近一周',
                            onClick(picker) {
                                const nowDate = new Date();
                                const oneWeekDate = new Date(nowDate - 7 * 24 * 3600 * 1000);
                                let nowDayOfWeek = oneWeekDate.getDay(); // 本周的第几天
                                let nowDay = oneWeekDate.getDate(); // 当前日
                                let nowMonth = oneWeekDate.getMonth(); // 当前月
                                let nowYear = oneWeekDate.getFullYear(); // 当前年
                                let start = new Date(nowYear, nowMonth, nowDay - (nowDayOfWeek === 0 ? 7 : nowDayOfWeek) + 1)
                                let end = new Date(nowYear, nowMonth, nowDay - (nowDayOfWeek === 0 ? 7 : nowDayOfWeek) + 7)
                                picker.$emit('pick', [start, end]);
                            }
                        }, {
                            text: '最近一个月',
                            onClick(picker) {
                                let start = new Date();
                                start.setMonth(start.getMonth() - 1);
                                start.setDate(1);
                                const end = new Date();
                                let oneDay = 3600 * 1000 * 24
                                end.setDate(1)
                                end.setTime(end.getTime() - oneDay)
                                picker.$emit('pick', [start, end]);
                            }
                        }, {
                            text: '最近三个月',
                            onClick(picker) {
                                let start = new Date();
                                start.setMonth(start.getMonth() - 3);
                                start.setDate(1);
                                const end = new Date();
                                let oneDay = 3600 * 1000 * 24
                                end.setDate(1)
                                end.setTime(end.getTime() - oneDay)
                                picker.$emit('pick', [start, end]);
                            }
                        }]
                    },
                    charts: false,
                    cType: false,
                    checked: false,
                    a: '',
                    dialogVisible1: false,
                    dialogVisible3: false,
                    dateList: [],
                    tables: [],
                    festivals: [
                        {
                            date: '2020-10-01',
                            label: '国庆节'
                        }],
                    weekDate: [],
                    needMergeArr: ['skuName'], // 有合并项的列
                    rowMergeArrs: {},
                    pageIndex: 1,
                    pageSize: 10,
                    totalPage: 0,
                    totalCount: 0,
                    labels: [],
                    props1: {
                        emitPath: false,
                        checkStrictly: true,
                        multiple: true,
                        label: 'name',
                        value: 'code',
                        lazy: true,
                        lazyLoad: this.lazyLoad1
                    },
                    props2: {
                        emitPath: false,
                        checkStrictly: true,
                        multiple: true,
                        label: 'name',
                        value: 'code',
                        lazy: true,
                        lazyLoad: this.lazyLoad2
                    },
                    dataForm: {
                        channelCode: 'C00001',
                        typeList: ['17'],
                        startTime: this.getBeginOflastWeek(),
                        quota1: [],
                        layeredCodeList: [],
                        layeredCodes: [],
                        quota11: []
                    },
                    defaultUnit: '',
                    defaultUnitItem: {
                        name: '销售单位',
                        type: 2
                    },
                    exportForm: {
                        pageNum: '',
                        pageSize: '',
                    },
                    unitOption: [],
                    dataListLoading: false,
                    targetOption: [],
                    currentPage4: '',
                    value2: ['预测计划数量', '上次预测数量', '预测差异数量', '预测差异比例']
                }
            },
            components: {
                scmPlanCommonChoosegoods
            },
            mounted() {
                this.getDataList()
                this.getUnit()
                this.getHolidays();
                this.dataForm.unitType = this.defaultUnitItem.type
            },
            methods: {
                getUnit() {
                    this.$http({
                        url: "scm-plan-admin/api/v1/outService/listUnitType",
                        method: 'GET'
                    }).then(result => {
                        const data = result.data;
                        if (data && data.code === '0') {
                            data.data.forEach(e => {
                                let obj = {}
                                obj.unitType = e.unitType
                                obj.unitName = e.unitName
                                this.unitOption.push(obj);
                            })

                        }
                    })
                },
                openPrompt(msg) {
                    this.$alert(msg, '提示', {confirmButtonText: '确定'});
                },
                getHolidays() {
                    this.$http({
                        url: 'scm-plan-admin/api/v1/outService/dateLabels',
                        method: 'get',
                        params: {
                            "startDate": this.getBeginOflastWeek()
                        }
                    }).then(result => {
                        this.festivals = result.data.data
                        this.$nextTick(function () {
                            this.initEcharts();
                            this.initFestivals();
                        });
                    })
                },

                lazyLoad2(node, resolve) {
                    if (node.level === 0) {
                        this.$http({
                            url: 'scm-plan-admin/api/v1/outService/searchAreaByLevels',
                            method: 'POST',
                            data: [1]
                        }).then(result => {
                            const nodes = result.data.data.list;
                            resolve(nodes);
                        })
                    } else {
                        let parentCode = node.value
                        let storeParamDTO = {};
                        storeParamDTO.districtCode = parentCode;
                        //下拉选项框只显示到区域的级别，不显示到办事处  区域的level默认是3
                        if (3 === node.data.level) {
                            this.$http({
                                url: 'scm-plan-admin/api/v1/outService/listStore?pageNum=1&pageSize=9999',
                                method: 'POST',
                                data: JSON.stringify(storeParamDTO)
                            }).then(result => {
                                resolve(result.data.data)
                            })
                        } else if (node.data.level < 3) {
                            this.$http({
                                url: 'scm-plan-admin/api/v1/outService/searchByParentCode?parentCode=' + parentCode,
                                method: 'GET'
                            }).then(result => {
                                const nodes = result.data.data;
                                resolve(nodes);
                            })
                        } else {
                            resolve([])
                        }
                    }
                },

                lazyLoad1(node, resolve) {
                    if (node.level === 0) {
                        this.$http({
                            url: 'scm-plan-admin/api/v1/outService/getCategoryListByLevel?level=2',
                            method: 'POST'
                        }).then(result => {
                            const nodes = result.data.data;
                            resolve(nodes);
                        })
                    } else if (node.level < 4) {
                        let stringList = [];
                        stringList.push(node.value)
                        this.$http({
                            url: 'scm-plan-admin/api/v1/outService/categoryListByCategoryCodes',
                            method: 'POST',
                            data: stringList
                        }).then(result => {
                            const nodes = (result.data.data)[0].categoryDTOList;
                            const id = (result.data.data)[0].id;
                            if (nodes.length > 0) {
                                resolve(nodes);
                            } else {
                                this.$http({
                                    url: "scm-plan-admin/api/v1/outService/skuListByCategoryId/" + id + "/1/9999",
                                    method: 'GET'
                                }).then(result => {
                                    const node = result.data.data;
                                    resolve(node)
                                })
                            }
                        })
                    } else {
                        resolve([])
                    }
                },

                getDataListIndex() {
                    this.pageIndex++
                    this.getDataList()
                },
                debounce(fn, wait) {
                    var timer = null;
                    return function () {
                        if (timer !== null) {
                            clearTimeout(timer);
                        }
                        timer = setTimeout(fn, wait);
                    }
                },
                //获取当前周的上一周的开始时间
                getBeginOflastWeek() {
                    let nowdate = new Date();
                    let oneweekdate = new Date(nowdate - 7 * 24 * 3600 * 1000);
                    let nowDayOfWeek = oneweekdate.getDay(); // 本周的第几天
                    let nowDay = oneweekdate.getDate(); // 当前日
                    let nowMonth = oneweekdate.getMonth(); // 当前月
                    let nowYear = oneweekdate.getFullYear(); // 当前年
                    let weekStartDate = new Date(nowYear, nowMonth, nowDay - (nowDayOfWeek == 0 ? 7 : nowDayOfWeek) + 1)
                    let y = weekStartDate.getFullYear();
                    let m = weekStartDate.getMonth() + 1;
                    let d = weekStartDate.getDate();
                    let formatwdate = y + '-' + m + '-' + d;
                    return formatwdate;
                },
                getDataList() {
                    this.dataListLoading = true;
                    this.dataForm.pageSize = this.pageSize;
                    this.dataForm.pageNum = this.pageIndex;
                    this.$http({
                        url: '/scm-plan-admin/api/v1/salesPlanDirectly/list',
                        method: 'post',
                        data: this.dataForm
                    }).then(result => {
                        const data = result.data;
                        if (data && data.code === '0') {
                            const result = data.data
                            if (result && result.dateList) {
                                this.weekDate = result.dateList;
                            }
                            let list;
                            if (result && result.infoList) {
                                list = result.infoList;
                            }
                            if (!list) {
                                this.dataList = [];
                                this.totalCount = 0;
                            } else {
                                this.setTargetKey(list[0]);
                                this.handerDataList(list);
                                this.rowMergeArrs = this.rowMergeHandle(this.needMergeArr, this.dataList); // 处理合并数据
                                this.pageIndex = data.data.pageNum
                                if (data.data.hasNextPage) {
                                    let tmpTotalCount = (data.data.pageNum + 1) * this.pageSize
                                    if (this.totalCount < tmpTotalCount) {
                                        this.totalCount = tmpTotalCount
                                    }
                                }
                            }
                        } else {
                            this.$message.error(result.data.msg);
                            this.dataList = [];
                            this.totalPage = 0;
                        }
                        this.dataListLoading = false;
                    }).catch(() => {
                        this.dataListLoading = false;
                    })
                },
                setTargetKey(item) {
                    this.targetOption = [];
                    this.targetOption.push(
                        {
                            label: item.forecastLabel,
                            value: 1
                        }, {
                            label: item.lastForecastLabel,
                            value: 2
                        }, {
                            label: item.forecastFlucteLabel,
                            value: 3
                        }, {
                            label: item.forecastFlucteRateLabel,
                            value: 4
                        }, {
                            label: item.confirmLabel,
                            value: 5
                        }, {
                            label: item.lastConfirmLabel,
                            value: 8
                        }, {
                            label: item.subConfirmLabel,
                            value: 17
                        }, {
                            label: item.confirmTargetLabel2,
                            value: 18
                        }, {
                            label: item.confirmTargetLabel3,
                            value: 19
                        }, {
                            label: item.confirmTargetLabel4,
                            value: 20
                        }, {
                            label: item.forecastDifferConfirmLabel,
                            value: 9
                        },
                        // {
                        //     label: item.actualReceiptLabel,
                        //     value: 10
                        // },
                        {
                            label: item.forecastRateConfirmLabel,
                            value: 11
                        },
                        {
                            label: item.actualSalesQtyLabel,
                            value: 12
                        }
                        // {
                        //     label: item.realTimeInventoryLabel,
                        //     value: 12
                        // }
                    )
                },
                rowMergeHandle(arr, data) {

                    if (!Array.isArray(arr) && !arr.length) return false;
                    if (!Array.isArray(data) && !data.length) return false;
                    let needMerge = {};
                    arr.forEach(i => {
                        needMerge[i] = {
                            rowArr: [],
                            rowMergeNum: 0
                        };
                        data.forEach((item, index) => {
                            if (index === 0) {
                                needMerge[i].rowArr.push(1);
                                needMerge[i].rowMergeNum = 0;
                            } else {
                                if (item[i] === data[index - 1][i]) {
                                    needMerge[i].rowArr[needMerge[i].rowMergeNum] += 1;
                                    needMerge[i].rowArr.push(0);
                                } else {
                                    needMerge[i].rowArr.push(1);
                                    needMerge[i].rowMergeNum = index;
                                }
                            }
                        });
                    });
                    return needMerge;
                },
                mergeAction(val, rowIndex, colData) {
                    let _row = this.rowMergeArrs[val].rowArr[rowIndex];
                    let _col = _row > 0 ? 1 : 0;
                    return [_row, _col];
                },
                arraySpanMethod({row, column, rowIndex, columnIndex}) {
                    if (columnIndex === 0 || column.property == 'status' || column.property == 'area' || column.property == 'skuName' || column.property == 'category') {
                        if (this.isContain(this.dataForm.quota1, 0) && rowIndex % this.targetOption.length === 0) {
                            return {
                                rowspan: this.targetOption.length,
                                colspan: 1
                            }
                        } else if (this.isContain(this.dataForm.quota1, 0) && rowIndex % this.targetOption.length !== 0) {
                            return {
                                rowspan: 0,
                                colspan: 0
                            }
                        }
                        if (!this.isContain(this.dataForm.quota1, 0) && rowIndex % this.dataForm.quota1.length === 0) {
                            return {
                                rowspan: this.dataForm.quota1.length,
                                colspan: 1
                            }
                        } else if (!this.isContain(this.dataForm.quota1, 0) && rowIndex % this.dataForm.quota1.length !== 0) {
                            return {
                                rowspan: 0,
                                colspan: 0
                            }
                        }
                    }
                },
                isContain(list, item) {
                    if (list.length === 0) {
                        return true
                    }
                    let e = list.find(e => {
                        return e === item
                    })
                    if (e !== undefined) {
                        return true
                    } else {
                        return false
                    }
                },
                handerDataList(dataList) {
                    let newDataList = [];
                    let _this = this
                    _this.lastQtyList = [];
                    dataList.forEach((item, index, array) => {
                        let confirmQty = [];
                        let lastConfirm = [];
                        this.infor.status = item.storeStatus;
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 1)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.forecastLabel, // 系统预测指标名称（标识）
                                qtyList: item.forecastQty,            // 系统预测量（数据）
                                flag: index,
                            });
                        }
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 2)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.lastForecastLabel, // 上次预测量指标名称（标识）
                                qtyList: item.lastForecastQty,            // 上次预测量（数据）
                                flag: index,
                            });
                        }
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 3)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.forecastFlucteLabel, // 预测浮动指标名称（标识）
                                qtyList: item.forecastFlucteQty,            // 预测浮动（数据）
                                flag: index,
                            });
                        }
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 4)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.forecastFlucteRateLabel, // 预测浮动比例指标名称（标识）
                                qtyList: item.forecastFlucteRateQty,            // 预测浮动比例（数据）
                                flag: index,
                                type: 1
                            });
                        }
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 5)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                areaCode: item.areaCode,
                                status: item.storeStatus,
                                planConfirmLabel: item.confirmLabel, // 确认量指标名称（标识）
                                qtyList: item.confirmQty,            // 确认量（数据）
                                flag: index,
                                isInput: item.confirmType,
                                type: 2
                            });
                            lastConfirm.push(...item.confirmQty)
                            this.lastQtyList.push({lastConfirm: lastConfirm});
                        }

                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 8)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.lastConfirmLabel, // 上次确认量（标识）
                                qtyList: item.lastConfirmQty,            // 上次确认量（数据）
                                flag: index,
                            });

                        }
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 17)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.subConfirmLabel, // 下级确认量（标识）
                                qtyList: item.subConfirmQty,            // 下级确认量（数据）
                                flag: index
                            });
                        }
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 18)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.confirmTargetLabel2, // 确认目标（标识）
                                qtyList: item.confirmTarget2,            // 确认目标（数据）
                                flag: index
                            });
                        }
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 19)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.confirmTargetLabel3, // 确认目标（标识）
                                qtyList: item.confirmTarget3,            // 确认目标（数据）
                                flag: index
                            });

                        }
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 20)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.confirmTargetLabel4, // 确认目标（标识）
                                qtyList: item.confirmTarget4,            // 确认目标（数据）
                                flag: index
                            });
                        }
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 19)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.forecastDifferConfirmLabel, // 预测确认差异（标识）
                                qtyList: item.forecastDifferConfirmQty,            // 预测确认差异（数据）
                                flag: index,
                            });
                        }
                        // if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 10)) {
                        //     newDataList.push({
                        //         channel: item.channel,
                        //         skuName: item.skuName,
                        //         skuCode: item.skuCode,
                        //         area: item.area,
                        //         category: item.category,
                        //         status: item.storeStatus,
                        //         planConfirmLabel: item.actualReceiptLabel, // 实际收货量（标识）
                        //         qtyList: item.actualReceiptQty,            // 实际收货量（数据）
                        //         flag: index,
                        //     });
                        // }
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 9)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.forecastRateConfirmLabel, // 预测确认差异比例（标识）
                                qtyList: item.forecastRateConfirmQty,            // 预测确认差异比例（数据）
                                flag: index,
                                type: 1
                            });
                        }
                        if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 12)) {
                            newDataList.push({
                                channel: item.channel,
                                skuName: item.skuName,
                                skuCode: item.skuCode,
                                area: item.area,
                                category: item.category,
                                status: item.storeStatus,
                                planConfirmLabel: item.actualSalesQtyLabel, // 实际销量（标识）
                                qtyList: item.actualSalesQty,            // 实际销量（数据）
                                flag: index,
                            });
                        }
                        // if (_this.isContain(_this.dataForm.quota1, 0) || _this.isContain(_this.dataForm.quota1, 12)) {
                        //     newDataList.push({
                        //         channel: item.channel,
                        //         skuName: item.skuName,
                        //         skuCode: item.skuCode,
                        //         area: item.area,
                        //         category: item.category,
                        //         status: item.storeStatus,
                        //         planConfirmLabel: item.realTimeInventoryLabel, // 当前实时库存量（标识）
                        //         qtyList: item.realTimeInventoryQty,            // 当前实时库存量（数据）
                        //         flag: index,
                        //     });
                        // }
                    });
                    this.dataList = newDataList
                },
                initFestivals() {
                    this.$refs.timeLine.vueComponent.festivalList = this.festivals
                    this.$refs.timeLine.vueComponent.initDate()
                },
                showDialog() {
                    this.dialogVisible = true
                    this.$nextTick(function () {
                        this.initEcharts();
                    });
                },
                initEcharts() {
                    this.echartsLoading = true;
                    // 基于准备好的dom，初始化echarts实例
                    let _this = this
                    if (_this.dateArr && _this.dateArr.length) {
                        _this.dataForm.startTime = _this.dateArr[0];
                        _this.dataForm.endTime = _this.dateArr[1];
                    }
                    _this.$http({
                        url: '/scm-plan-admin/api/v1/salesPlanDirectly/listAll',
                        method: 'post',
                        data: _this.dataForm
                    }).then(result => {

                        if (result.data.code === '0') {
                            _this.dateList = result.data.data.dateList
                            _this.labels = [];
                            result.data.data.infoList.forEach(e => {

                                _this.labels.push(e.forecastLabel);
                                _this.labels.push(e.lastForecastLabel);
                                _this.labels.push(e.forecastFlucteLabel);
                                _this.labels.push(e.forecastFlucteRateLabel);
                                _this.labels.push(e.confirmLabel);
                                _this.labels.push(e.lastConfirmLabel);
                                _this.labels.push(e.subConfirmLabel);
                                _this.labels.push(e.confirmTargetLabel2);
                                _this.labels.push(e.confirmTargetLabel3);
                                _this.labels.push(e.confirmTargetLabel4);
                                _this.labels.push(e.forecastDifferConfirmLabel);
                                // _this.labels.push(e.actualReceiptLabel);
                                _this.labels.push(e.forecastRateConfirmLabel);
                                // _this.labels.push(e.realTimeInventoryLabel);
                                _this.labels.push(e.actualSalesQtyLabel);

                                _this.confirmLabel = e.confirmLabel;
                                _this.lastConfirmLabel = e.lastConfirmLabel;
                                _this.subConfirmLabel = e.subConfirmLabel;

                                _this.forecastQty = e.forecastQty;
                                _this.lastForecastQty = e.lastForecastQty;
                                _this.forecastFlucteQty = e.forecastFlucteQty;
                                _this.forecastFlucteRateQty = this.acFormat(e.forecastFlucteRateQty);
                                _this.confirmQty = e.confirmQty;
                                _this.lastConfirmQty = e.lastConfirmQty;
                                _this.subordConfirmQty = e.subordConfirmQty;
                                _this.confirmTarget2 = e.confirmTarget2
                                _this.confirmTarget3 = e.confirmTarget3
                                _this.confirmTarget4 = e.confirmTarget4
                                _this.forecastDifferConfirmQty = e.forecastDifferConfirmQty;
                                // _this.actualReceiptQty = e.actualReceiptQty;
                                _this.forecastRateConfirmQty = this.acFormat(e.forecastRateConfirmQty);
                                _this.actualSalesQty = e.actualSalesQty;
                                // _this.realTimeInventoryQty = e.realTimeInventoryQty;
                            })
                            _this.initOpentionEcharts()
                        } else {
                            _this.$message.error(result.data.msg);
                            this.echartsLoading = false;
                        }
                    }).then(e => {
                        this.echartsLoading = false;
                    })
                },
                acFormat(val) {
                    let acFormatQty = []
                    val.forEach(e => {
                        acFormatQty.push((e * 100).toFixed(3));
                    })
                    return acFormatQty
                },
                initOpentionEcharts() {
                    let _this = this
                    let ec = null;
                    if (echarts != undefined) {
                        ec = echarts;
                    } else {
                        ec = window.echarts;
                    }
                    var myChart = ec.init(document.getElementById('echarts'));
                    let arr = {}
                    let serArr = [
                        {
                            name: '预测计划数量',
                            type: 'bar',
                            data: _this.forecastQty
                        },
                        {
                            name: '上次预测数量',
                            type: 'bar',
                            data: _this.lastForecastQty
                        },
                        {
                            name: '预测差异数量',
                            type: 'bar',
                            data: _this.forecastFlucteQty
                        },
                        {
                            name: '预测差异比例',
                            type: 'line',
                            yAxisIndex: 1,
                            data: _this.forecastFlucteRateQty
                        },
                        {
                            name: _this.confirmLabel,
                            type: 'bar',
                            data: _this.confirmQty
                        },
                        {
                            name: _this.lastConfirmLabel,
                            type: 'bar',
                            data: _this.lastConfirmQty
                        },
                        {
                            name: _this.subConfirmLabel,
                            type: 'bar',
                            data: _this.subConfirmQty
                        },
                        {
                            name: '区总确认目标数量',
                            type: 'bar',
                            data: _this.confirmTarget2
                        },
                        {
                            name: '片总确认目标数量',
                            type: 'bar',
                            data: _this.confirmTarget3
                        },
                        {
                            name: '地总确认目标数量',
                            type: 'bar',
                            data: _this.confirmTarget4
                        },
                        {
                            name: '预测确认差异数量',
                            type: 'bar',
                            data: _this.forecastDifferConfirmQty
                        },
                        // {
                        //     name: '实际收货量',
                        //     type: 'bar',
                        //     data: _this.actualReceiptQty
                        // },
                        {
                            name: '预测确认差异比例',
                            type: 'line',
                            yAxisIndex: 1,
                            data: _this.forecastRateConfirmQty
                        },
                        {
                            name: '实际销售销数量',
                            type: 'bar',
                            data: _this.actualSalesQty
                        }
                        // {
                        //     name: '当前实时库存量',
                        //     type: 'bar',
                        //     data: _this.realTimeInventoryQty
                        // }
                    ]
                    let arr2 = []
                    serArr.forEach(e => {
                        let obj = _this.value2.find(e1 => {
                            return e1 === e.name
                        })
                        if (obj) {
                            arr2.push(e)
                        }
                    })
                    let option = {
                        color: ['#4BA2FD', '#5AD8A6', '#6DC8EC', '#945FB9'],
                        title: {
                            text: ''
                        },
                        dataZoom: [
                            {
                                type: 'slider',//有单独的滑动条，用户在滑动条上进行缩放或漫游。inside是直接可以是在内部拖动显示
                                show: true,//是否显示 组件。如果设置为 false，不会显示，但是数据过滤的功能还存在。
                                start: 0,//数据窗口范围的起始百分比0-100
                                end: 50,//数据窗口范围的结束百分比0-100
                                bottom: -10 //距离底部的距离
                            },
                            //2.在内部可以横向拖动
                            {
                                type: 'inside',// 内置于坐标系中
                                start: 0,
                                end: 50
                            }
                        ],
                        tooltip: {
                            trigger: 'axis',
                            axisPointer: {
                                type: 'cross',
                                crossStyle: {
                                    color: '#999'
                                }
                            }
                        },
                        legend: {
                            type: 'scroll',
                            orient: 'horizontal',
                            data: _this.value2,
                            selected: arr
                        },
                        grid: {
                            left: '3%',
                            right: '4%',
                            bottom: '3%',
                            containLabel: true
                        },
                        xAxis: {
                            type: 'category',
                            data: _this.dateList,
                            axisPointer: {
                                type: 'shadow'
                            }
                        },
                        yAxis: [
                            {
                                type: 'value',
                                name: '量',
                                axisLabel: {
                                    formatter: '{value}'
                                }
                            },
                            {
                                type: 'value',
                                name: '百分比',
                                axisLabel: {
                                    formatter: '{value} %'
                                },
                                splitLine: {     //去掉网格线
                                    show: false
                                }
                            }
                        ],
                        series: arr2
                    };
                    myChart.setOption(option, true);
                    this.echartsLoading = false;
                },
                offsetFun(val) {
                    let offSetNum = val.target.vueComponent.offSetNum
                    let obj = {
                        startTime: '',
                        endTime: ''
                    }
                    if (offSetNum === 16) {
                        obj.startTime = this.dateFormat('YYYY-mm-dd HH:MM:SS', val.target.vueComponent.dateList[val.target.vueComponent.offSetNum - 1].date),
                            obj.endTime = this.dateFormat('YYYY-mm-dd HH:MM:SS', val.target.vueComponent.dateList[val.target.vueComponent.offSetNum].date1)
                    } else {
                        obj.startTime = this.dateFormat('YYYY-mm-dd HH:MM:SS', val.target.vueComponent.dateList[val.target.vueComponent.offSetNum - 1].date)
                        obj.endTime = this.dateFormat('YYYY-mm-dd HH:MM:SS', val.target.vueComponent.dateList[val.target.vueComponent.offSetNum + 1].date)
                    }
                    this.dataForm.startTime = obj.startTime
                    this.dataList = []
                    this.totalCount = 0
                    this.pageIndex = 1
                    this.getDataList()
                },
                changePicker(val) {
                    this.dateArr = val
                    this.initEcharts()
                },
                searchList() {
                    let _this = this
                    _this.dataList = []
                    _this.totalCount = 0
                    _this.pageIndex = 1
                    this.dataForm.quota1 = this.dataForm.quota11
                    //区域
                    this.dataForm.areaCodeList = []
                    this.$refs.tree2.getCheckedNodes().forEach(e => {
                        _this.dataForm.areaCodeList.push({
                            level: e.level,
                            code: e.data.code
                        })
                    })
                    //品类
                    this.dataForm.categoryCodeList = []
                    this.$refs.tree3.getCheckedNodes().forEach(e => {
                        _this.dataForm.categoryCodeList.push({
                            level: e.level + 1,
                            code: e.data.code
                        })
                    })
                    let skuCodeS = _this.dataForm.skuCodeS;
                    if (skuCodeS && skuCodeS.length) {
                        let skuCode = skuCodeS.split(/[(\r\n)\r\n]+/);
                        skuCode.forEach(e => {
                            _this.dataForm.categoryCodeList.push({
                                level: 5,
                                code: e
                            })
                        })
                    }
                    /*this.dataForm.layeredCodeList = []
                    if (this.dataForm.layeredCodes) {
                        this.dataForm.layeredCodes.forEach(e => {
                            this.dataForm.layeredCodeList.push(e)

                        })
                    }*/
                    _this.getDataList()
                    _this.initEcharts()
                    _this.dialogVisible = false
                    _this.dialogFormVisible = false
                },
                clearCondition() {
                    this.dataForm.skuCodeS = ''
                    this.dataForm.areaCodes = []
                    this.dataForm.categoryCodes = []
                    this.dataForm.layeredCodeList = []
                    this.dataForm.quota11 = []
                },
                sizeChangeHandle(val) {
                    this.pageSize = val;
                    this.totalCount = 0
                    this.pageIndex = 1;
                    this.getDataList();
                },
                currentChangeHandle(val) {
                    this.pageIndex = val;
                    this.getDataList();
                },
                fullScreen() {
                    let _this = this;
                    this.dialogVisible1 = true;
                    if (_this.$refs.table.selection && _this.$refs.table.selection.length) {
                        let selection = _this.$refs.table.selection
                        let rows = []
                        selection.forEach(item => {
                            rows.push(item)
                        })
                        //赋值全屏table
                        _this.$nextTick(function () {
                            this.$refs.tablemax.clearSelection();
                            if (rows) {
                                rows.forEach(row => {
                                    _this.$refs.tablemax.toggleRowSelection(row, true);
                                });
                            }
                        });
                    }
                },
                leaveFullScreen() {
                    let _this = this;
                    this.dialogVisible1 = false;
                    if (_this.$refs.tablemax.selection && _this.$refs.tablemax.selection.length) {
                        let selection = _this.$refs.tablemax.selection
                        let rows = []
                        selection.forEach(item => {
                            rows.push(item)
                        })
                        //赋值全屏table
                        this.$refs.table.clearSelection();
                        if (rows) {
                            rows.forEach(row => {
                                _this.$refs.table.toggleRowSelection(row, true);
                            });
                        }
                    }
                },
                // 关闭窗口
                closeChooseGoodsDialog() {
                    this.chooseGoodsDialog = false
                },
                //查看日志
                choiceAllocationDetail() {
                    this.chooseGoodsDialog = true
                    this.$nextTick(() => {
                        this.$refs.scmPlanCommonChoosegoods.getDataList(1)
                    })
                },
                exportExcel(val) {
                    let _this = this
                    //下标集合
                    _this.exportForm.rowIndex = []
                    //计划类型
                    _this.exportForm.typeList = _this.dataForm.typeList
                    //区域
                    _this.exportForm.areaCodeList = _this.dataForm.areaCodeList;
                    //品类
                    _this.exportForm.categoryCodeList = _this.dataForm.categoryCodeList;
                    //分层
                    _this.exportForm.layeredCodeList = _this.dataForm.layeredCodeList
                    //起始时间
                    _this.exportForm.startTime = _this.dataForm.startTime
                    //分页信息
                    _this.exportForm.pageSize = _this.pageSize;
                    _this.exportForm.pageNum = _this.pageIndex;
                    //单位
                    _this.exportForm.unitType = _this.dataForm.unitType

                    let boo = false
                    if (val === 2) {
                        let array = []
                        if (this.dialogVisible1) {
                            if (this.$refs.tablemax.selection && this.$refs.tablemax.selection.length > 0) {
                                this.$refs.tablemax.selection.forEach(e => {
                                    array.push(e.flag)
                                })
                            } else {
                                boo = true
                            }
                        } else {
                            if (this.$refs.table.selection && this.$refs.table.selection.length > 0) {
                                this.$refs.table.selection.forEach(e => {
                                    array.push(e.flag)
                                })
                            } else {
                                boo = true
                            }
                        }
                        this.exportForm.rowIndex = [...new Set(array)]
                    }
                    if (boo) {
                        this.$message({
                            message: '请选择至少一条数据',
                            type: 'error'
                        })
                        return false
                    }
                    const loading = this.$loading({
                        lock: true,
                        text: '处理中···   ',
                        spinner: 'el-icon-loading',
                        background: 'rgba(0, 0, 0, 0.7)'
                    });
                    this.$http({
                        url: '/scm-plan-admin/api/v1/salesPlanDirectly/exportExcel',
                        method: 'post',
                        data: this.exportForm,
                        params: {type: val}
                    }).then(result => {
                        loading.close();
                        this.openPrompt("导出任务处理中，请至任务列表查看！");
                        /*let data = result.data;
                        let fileReader = new FileReader();
                        fileReader.onload = function () {
                            try {
                                let jsonData = JSON.parse(this.result);  // 说明是普通对象数据，后台转换失败
                                loading.close();
                                if (jsonData.msg) {
                                    _this.$message({
                                        message: jsonData.msg,
                                        type: 'error'
                                    })
                                }
                            } catch (err) {   // 解析成对象失败，说明是正常的文件流
                                const disposition = result.headers['content-disposition'];
                                let fileName = disposition.substring(disposition.indexOf('filename=') + 9, disposition.length);
                                fileName = decodeURIComponent(fileName);
                                let blob = new Blob([data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"});
                                if ('download' in document.createElement('a')) { // 非IE下载
                                    const elink = document.createElement('a')
                                    elink.download = fileName
                                    elink.style.display = 'none'
                                    elink.href = URL.createObjectURL(blob)
                                    document.body.appendChild(elink)
                                    elink.click()
                                    URL.revokeObjectURL(elink.href) // 释放URL 对象
                                    document.body.removeChild(elink)
                                } else { // IE10+下载
                                    navigator.msSaveBlob(blob, fileName)
                                }
                                loading.close();
                            }
                        };
                        fileReader.readAsText(data, "utf-8")*/
                    }).catch(function (e) {
                        loading.close();
                    })
                },
                download(data) {
                    if (!data) {
                        return
                    }
                    let url = window.URL.createObjectURL(new Blob([data]))
                    let link = document.createElement('a')
                    link.style.display = 'none'
                    link.href = url
                    link.setAttribute('download', 'excel.xlsx')

                    document.body.appendChild(link)
                    link.click()
                },
                labelChange(val) {
                    this.initOpentionEcharts()
                },
                dateFormat(fmt, date) {

                    let ret;
                    const opt = {
                        "Y+": date.getFullYear().toString(),        // 年
                        "m+": (date.getMonth() + 1).toString(),     // 月
                        "d+": date.getDate().toString(),            // 日
                        "H+": date.getHours().toString(),           // 时
                        "M+": date.getMinutes().toString(),         // 分
                        "S+": date.getSeconds().toString()          // 秒
                        // 有其他格式化字符需求可以继续添加，必须转化成字符串
                    };
                    for (let k in opt) {
                        ret = new RegExp("(" + k + ")").exec(fmt);
                        if (ret) {
                            fmt = fmt.replace(ret[1], (ret[1].length === 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
                        }
                    }
                    return fmt;
                },
                findStyle({row, column, rowIndex, columnIndex}) {
                    if (column.label && typeof parseInt(column.label.substr(0, 1)) === 'number' && !isNaN(column.label.substr(0, 1))) {
                        return "padding: 0;background: #4ba2fd;color: #ffffff"
                    } else {
                        return "padding: 0;background: #f8f8f8"
                    }
                },
                saveButton() {
                    let set = []
                    let data = this.updateFrom;
                    let ifTrue = false;
                    if (this.dialogVisible1) {
                        if (this.$refs.tablemax.selection && this.$refs.tablemax.selection.length) {
                            ifTrue = true;
                        }
                    } else {
                        if (this.$refs.table.selection && this.$refs.table.selection.length) {
                            ifTrue = true;
                        }
                    }
                    if (ifTrue) {
                        this.$confirm('是否修改本次确认数量?', '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            type: 'warning'
                        }).then(() => {
                            data.forEach((e, i) => {
                                this.weekDate.forEach((a, j) => {
                                    if (e.val.qtyList[j] && e.val.qtyList[j] !== this.lastQtyList[e.idx].lastConfirm[j]) {
                                        let formData = {};
                                        let dateArr = a.split("-");
                                        //dateArr["xx.xx","xx.xx"] 10.19 --->2020-10-19
                                        let nowDate = new Date();
                                        let y = nowDate.getFullYear();
                                        let startDate = dateArr[0].split(".");
                                        let endDate = dateArr[1].split(".");
                                        formData.planStartDate = y + "-" + startDate[0] + "-" + startDate[1];
                                        formData.planEndDate = y + "-" + endDate[0] + "-" + endDate[1];
                                        formData.channelCode = e.channel;
                                        let areaArr = e.val.areaCode.split("/");
                                        switch (areaArr.length) {
                                            case 1:
                                                formData.provinceCode = areaArr[0]
                                                break;
                                            case 2:
                                                formData.cityCode = areaArr[1]
                                                break
                                            case 3:
                                                formData.countyCode = areaArr[2]
                                                break
                                            case 4:
                                                formData.storeCode = areaArr[3]
                                                break
                                            default:
                                                break
                                        }
                                        formData.skuCode = e.val.skuCode;
                                        formData.typeList = this.dataForm.typeList;
                                        formData.confirmQty = e.val.qtyList[j];
                                        set.push(formData);
                                    }
                                })
                            })
                            this.$http({
                                url: '/scm-plan-admin/api/v1/salesPlanDirectly/updateConfirm?unitType=' + this.dataForm.unitType,
                                method: 'post',
                                data: set
                            }).then(result => {
                                const data = result.data;
                                if (data && data.code === '0') {
                                    this.$message.success("更新成功");
                                } else {
                                    this.$message.error(result.data.msg);
                                }
                                this.getDataList();
                            }).catch(() => {
                                this.$message.error("服务器异常");
                            })
                        }).catch(() => {
                            this.$message({
                                type: 'info',
                                message: '已取消确认'
                            });
                        });
                    } else {
                        this.$message({
                            message: '请至少选择一条数据',
                            type: 'error'
                        })
                        return false
                    }
                },
                /*点击单位触发事件*/
                commandUnit(val) {
                    this.defaultUnit = val.unitName
                    this.dataForm.unitType = val.unitType;
                    this.getDataList();
                    this.initEcharts();
                },
                //初始化上传接口参数
                handleChangeUpload(file) {
                    var FileExt = file.name.replace(/.+\./, "");
                    if (['xls', 'xlsx'].indexOf(FileExt.toLowerCase()) === -1) {
                        this.importErrInfo = '非excel文件';
                    }
                    this.fileList.push(file)
                    this.activeStep = 2;
                },
                selectChange(selection) {
                    this.updateFrom = [];
                    if (selection && selection.length) {
                        selection.forEach(e => {
                            this.dataList.forEach(a => {
                                if (e.flag === a.flag && a.planConfirmLabel === this.labels[4]) {
                                    this.updateFrom.push({
                                        idx: e.flag,
                                        val: a
                                    });
                                }
                            })
                        })
                    } else {
                        this.updateFrom = [];
                    }
                },
                //关闭上传框
                handleClose(done) {
                    this.$confirm('确认关闭？')
                        .then(_ => {
                            this.fileList = [];
                            this.activeStep = 1;
                            this.dialogVisible3 = false;
                            this.importErrInfo = '';
                            done();
                        }).catch(_ => {
                    });
                },
                //上传文件
                submitUpload() {
                    let that = this;
                    const loading = this.$loading({
                        lock: true,
                        text: '上传中···   ',
                        spinner: 'el-icon-loading',
                        background: 'rgba(0, 0, 0, 0.7)'
                    });
                    const config = {headers: {'Content-Type': 'multipart/form-data'}}
                    let uploadData = new FormData()
                    uploadData.append("file", this.fileList[0].raw)
                    this.$http.post('scm-plan-admin/api/v1/salesPlanDirectly/importVerification?unitType=' + this.dataForm.unitType, uploadData, config
                    ).then(function (res) {
                        const data = res.data;
                        that.importErrInfo = '上传成功,请至任务列表查看状态！';
                        that.activeStep = 3;
                        loading.close();
                    }).catch(e => {
                        that.$message.error('上传失败')
                        that.importErrInfo = '服务器异常';
                        that.activeStep = 2;
                        loading.close();
                    });
                },
                onClickCancelBtn() {
                    this.fileList = [];
                    this.activeStep = 1;
                    this.dialogVisible3 = false;
                    this.importErrInfo = '';
                },
                resetBtn() {
                    this.activeStep = 1;
                    this.importErrInfo = '';
                    this.fileList = [];
                },
                selectAllChange(selection) {
                    this.updateFrom = [];
                    if (selection && selection.length) {
                        selection.forEach((e, idx) => {
                            if (e.flag === this.dataList[idx].flag && this.dataList[idx].planConfirmLabel === this.labels[4]) {
                                this.updateFrom.push(this.dataList[idx]);
                            }
                        })
                    } else {
                        this.updateFrom = [];
                    }
                },
                indexContent(val) {
                    switch (val) {
                        case '预测计划数量':
                            return '单品-直营渠道预测计划数量'
                        case '上次预测数量':
                            return '单品-直营渠道上次预测数量'
                        case '预测差异数量':
                            return '同日/周：本次预测计划数量（单品） — 上次预测计划数量（单品）'
                        case '预测差异比例':
                            return '同日/周：预测差异数量 / 本次预测计划数量（单品）'
                        case '本次确认数量':
                            return '单品-直营渠道确认数量'
                        case '上次确认数量':
                            return '单品-直营渠道区总上次确认数量'
                        case '下级确认数量':
                            return '单品-直营渠道区总下级确认数量'
                        case '区总确认目标数量':
                            return '区总自上而下所拆解的目标'
                        case '片总确认目标数量':
                            return '片总自上而下所拆解的目标'
                        case '地总确认目标数量':
                            return '地总自上而下所拆解的目标'
                        case '预测确认差异数量':
                            return '直营渠道确认数量（单品）—直营渠道预测量数量（单品）'
                        case '预测确认差异比例':
                            return '预测确认差异数量 / 直营渠道确认数量（单品）'
                        // case '实际收货量(箱规)':
                        //     return '实际收货入库完成数量总和'
                        // case '期末库存':
                        //     return '根据当前查询门店/区域显示实时库存'
                        default:
                            return ''
                    }
                }
            },
            template: `
              <div>
                <el-card class="box-card">
                <el-dialog  :visible.sync="chooseGoodsDialog" title="任务列表"  width="80%" :modal="true">
            <span>
            <scmPlanCommonChoosegoods v-if="chooseGoodsDialog" ref="scmPlanCommonChoosegoods"  @closeChooseGoodsDialog="closeChooseGoodsDialog"></plan-common-choosegoods>
          </span>
        </el-dialog>
              <div slot="header" class="clearfix">
                <div style="text-align: right;margin: 5px">
                <span style="float: left;color: rgba(0,0,0,0.85);font-size: 16px;line-height:35px">时间范围</span>
                <el-button  size="small"  style="float: left;margin-left: 10px"  @click="fullScreen" >全屏</el-button>
                <el-button size="small" type="primary" style="margin-right: 5px"  @click="choiceAllocationDetail">任务列表</el-button>
                <el-dropdown @command="commandUnit" style="margin-right: 5px;">
                  <el-button  type="info" size="small" style="margin-left: 5px;">
                    {{defaultUnit?defaultUnit:defaultUnitItem.name}}<i class="el-icon-arrow-down el-icon--right"></i></el-button>
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item v-for="item in unitOption" :command="item">{{item.unitName}}</el-dropdown-item>                      
                  </el-dropdown-menu>
                </el-dropdown>
                 <el-button size="small"  icon="el-icon-search" type="primary" style="float: right;margin-left: 10px" @click="dialogFormVisible = true">高级搜索</el-button>
                 <el-dialog title="高级搜索" style="text-align: left" width="70%" :visible.sync="dialogFormVisible">
                    <div>   
                        <el-form :inline="true" label-width="100px" :model="dataForm"  size="small"  class="demo-form-inline">
                        <el-row>
                        <el-form :inline="true" label-position="right" label-width="100px" style="text-align:center;" :model="dataForm"  size="small"  class="demo-form-inline">
                              <el-col :span="8">
                              <el-form-item label="区域选择:">
                             <el-cascader
                             ref="tree2"
                            v-model="dataForm.areaCodes"
                            clearable
                            :props="props2"
                            ></el-cascader>
                              </el-form-item>
                              </el-col><el-col :span="8">
                              <el-form-item label="商品选择:">
                                 <el-cascader :props="props1" clearable v-model="dataForm.categoryCodes" ref="tree3" ></el-cascader>
                              </el-form-item>
                              </el-col>
                              <el-col :span="8">
                              <el-form-item label="商品编码:">
                              <el-input type="textarea"
                              :autosize="{ minRows: 1, maxRows: 4}" style="width:210px;" placeholder="请输入商品编码"
                              v-model="dataForm.skuCodeS"
                              clearable></el-input>
                            </el-form-item>
                            </el-col>
                            </el-row>
                            <!--<el-row>
                            <el-col :span="24">
                              <el-form-item label="分层类型:" v-show="dataForm.areaCodes && dataForm.areaCodes.length">
                                    <el-select  style="width:100%" @change="dataForm.layeredCodes = []" v-model="dataForm.randType" clearable placeholder="请选择">
                                        <el-option label="销量分层" value="sale"></el-option>
                                        <el-option label="销售额分层" value="amount"></el-option>
                                    </el-select>
                                </el-form-item>
                                </el-col>
                              <el-col :span="24">
                              <el-form-item label="商品分层:" v-show="dataForm.areaCodes && dataForm.areaCodes.length && dataForm.randType && dataForm.randType.length">
                                <el-checkbox-group v-model="dataForm.layeredCodes">
                                             <el-checkbox label="A">A</el-checkbox>
                                             <el-checkbox label="B">B</el-checkbox>
                                             <el-checkbox label="C">C</el-checkbox>
                                             <el-checkbox label="D">D</el-checkbox>
                              </el-checkbox-group>
                              </el-form-item>
                              </el-col></el-row>--><el-row>
                              <el-col :span="24">
                                  <el-form-item label="指标选择:">
                                        <el-checkbox-group v-model="dataForm.quota11">
                                        <el-row>
                                            <el-col :span="6"  v-for="item in targetOption">
                                             <el-checkbox :key="item.value"  :label="item.value">{{ item.label }}</el-checkbox></el-col>
                                        </el-row>
                                        </el-checkbox-group>
    <!--                                     <el-select  style="width:100%" v-model="dataForm.quota11" clearable  multiple  placeholder="请选择">-->
    <!--                                      <el-option-->
    <!--                                        v-for="item in targetOption"-->
    <!--                                        :key="item.value"-->
    <!--                                        :label="item.label"-->
    <!--                                        :value="item.value">-->
    <!--                                      </el-option>-->
    <!--                                    </el-select>-->
                                  </el-form-item>
                              </el-col>
                              </el-row>
                            </el-form>
                              </el-col><el-col :span="8">
                              <el-form-item label="指标选择:">
                                     <el-select  style="width:100%" v-model="dataForm.quota11" clearable  multiple  placeholder="请选择">
                                      <el-option
                                        v-for="item in targetOption"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                      </el-option>
                                    </el-select>
                              </el-form-item>
                              </el-col><el-col :span="8">
                              <el-form-item label="商品编码:">
                              <el-input type="textarea"
  :autosize="{ minRows: 1, maxRows: 4}" style="width:210px;" placeholder="请输入商品编码"
  v-model="dataForm.skuCodeS"
  clearable></el-input>
</el-form-item>
</el-col><!--<el-col :span="8">
                                <el-form-item label="分层类型:" v-show="dataForm.areaCodes && dataForm.areaCodes.length">
                                    <el-select  style="width:100%" v-model="dataForm.randType" clearable placeholder="请选择">
                                        <el-option label="销量分层" value="sale"></el-option>
                                        <el-option label="销售额分层" value="amount"></el-option>
                                    </el-select>
                                </el-form-item>
                              </el-col><el-col :span="8">
                              <el-form-item label="商品分层:" v-show="dataForm.randType && dataForm.randType.length">
                                  <el-select  style="width:100%" v-model="dataForm.layeredCodes" clearable  multiple  placeholder="请选择">
                                      <el-option
                                        label="A"
                                        value="A">
                                      </el-option>
                                      <el-option
                                        label="B"
                                        value="B">
                                      </el-option>
                                      <el-option
                                        label="C"
                                        value="C">
                                      </el-option>
                                      <el-option
                                        label="D"
                                        value="D">
                                      </el-option>
                                    </el-select>
                              </el-form-item>
                              </el-col>-->
                            </el-form>
                        </el-row>
                        <div slot="footer" style="text-align: center">
                            <span class="dialog-footer">
                            <el-button size="mini" @click="clearCondition">清 除 条 件</el-button>
                            <el-button type="primary" size="mini" @click="searchList">搜 索</el-button>
                          </span>
                        </div>  
                    </div>
                  </el-dialog>
                  <el-button  size="small" @click="saveButton" type="primary" style="margin-right: 5px;">确认</el-button>
                 
                  <el-button size="small" type="primary" style="margin-right: 5px;" @click="dialogVisible3 = true">导入</el-button>
                
                 <el-dropdown @command="exportExcel">
                      <el-button type="primary"  size="small" >
                        导出<i class="el-icon-arrow-down el-icon--right"></i></el-button>
                      <el-dropdown-menu slot="dropdown">
                        <el-dropdown-item :command="1">当前页数据</el-dropdown-item>
                        <el-dropdown-item :command="2">已勾选数据</el-dropdown-item>
                        <el-dropdown-item :command="3">所有查询结果</el-dropdown-item>
                      </el-dropdown-menu>
                    </el-dropdown>
             </div>
              </div>
              <el-dialog title="导入引导" :visible.sync="dialogVisible3" :close-on-click-modal="false" :beforeClose="handleClose" width="700px">
                    <el-steps :active="activeStep" align-center>
                        <el-step title="上传文档"></el-step>
                        <el-step title="导入并校验"></el-step>
                        <el-step title="创建完成"></el-step>
                    </el-steps>
                    <div v-show="activeStep !== 3">
                        <div>
                            <div style="color:red;">注意事项:</div>
                            <p>（1）模板中的标题不可更改，标题行不可删除；</p>
                            <p>（2）除必填的列以外，不需要的列可以删除；</p>
                            <p>（3）单次导入的数据不超过20000条；</p>
                        </div>
                    </div>
                    <div v-show="activeStep === 1">
                        2. 请选择要导入的数据文件。
                        <el-upload :on-change="handleChangeUpload" accept=".xls,.xlsx" :show-file-list="false" :auto-upload="false" class="upload-demo" style="padding:5px 18px;" action="https://jsonplaceholder.typicode.com/posts/" :limit="1" :file-list="fileList">
                            <el-button size="small" type="primary"><i class="el-icon-plus"></i>&nbsp;选择文件</el-button>
                            <div slot="tip" class="el-upload__tip" style="color:#ccc;">请选择excel文件，允许上传附件类型（xls,xlsx），文件大小不得大于100MB</div>
                        </el-upload>
                    </div>
                    <div class="file-list" v-show="fileList.length > 0">
                        <div class="file-list__item" style="marginTop:20px;padding:10px 20px;backgroundColor: #eaeaea;display:flex;justifyContent: space-between;" v-for="item in fileList" :key="item.name">
                            <div>{{item.name}}</div>
                            <div>{{(item.size/1024).toFixed(2)}}KB</div>
                            <div>完成</div>
                        </div>
                    </div>
                    <div slot="footer" class="dialog-footer" style="text-align:center;">
                        <el-button type="primary" @click.native="submitUpload" :disabled="activeStep===1" v-show="activeStep !==3">开始导入</el-button>
                        <el-button @click.native="onClickCancelBtn" v-show="activeStep !==3">{{cancelBtnText}}</el-button>
                        <el-button @click="resetBtn" v-if="activeStep != 1">重置</el-button>
                        <el-button @click.native="onClickCancelBtn" v-show="activeStep ===3">关闭</el-button>
                    </div>
                    <p style="text-align: center;color:red;margin-top:10px;" v-if="importErrInfo != '' && importErrInfo != null">{{importErrInfo}}</p>
                </el-dialog>
            <time-line ref="timeLine" @offsetFun="offsetFun"></time-line>
            <el-table v-loading="dataListLoading" v-if="dataList.length === 0 "></el-table>
            <el-table
                :data="dataList"
                :span-method="arraySpanMethod"
                center
                ref="table"
                border
                v-loading="dataListLoading"
                v-show="dataList.length"
                highlight-current-rows
                height="33vh"
                @select="selectChange"
                @select-all="selectAllChange"
                :header-row-style="{height: '20px',fontSize: '14px', fontWeight: '700',lineHeight: '36px',textAlign: 'center',backgroundColor: '#f3f4f4',padding: 0}"
                :row-style="{ color: '#999A9A', height: '16px',fontSize: '12px', fontWeight: 400,lineHeight: '26px',textAlign: 'center'}"
                :cell-style="{padding: 0}"
                 :header-cell-style="findStyle"
                style="width: 100%;padding: 0"
                :highlight-current-row="false">
            <el-table-column
                    type="selection"
                     fixed="left"
                    width="55">
            </el-table-column>
          
                <el-table-column
                width="130"
                  prop="area"
                  fixed="left"
                  label="区域" align="left">
                   <template slot-scope="scope">
                        {{scope.row.area == null || scope.row.area == '' ? "全国" : scope.row.area}}
                    </template>
                </el-table-column>
                <el-table-column
                  prop="category"
                  width="130"
                  fixed="left"
                  label="品类" align="left">
                </el-table-column>
                <el-table-column
                  prop="skuName"
                  fixed="left"
                  width="130"
                  label="商品" align="left">
                  <template slot-scope="scope">
                      {{scope.row.skuName}}/{{scope.row.skuCode}}
                  </template>
                </el-table-column>
                 <el-table-column
                 v-if="infor.status != null"
                  prop="status"
                  width="130"
                  fixed="left"
                  label="门店确认状态" align="left">
                  <template slot-scope="scope">
                      {{scope.row.status == 0 ? '待提交' :  scope.row.status == 10 ? '已暂存' : scope.row.status == 20 ? '已提交' : scope.row.status == 30 ? '已取消' : ''}}
                  </template>
                </el-table-column>
                <el-table-column
                width="130"
                fixed="left"
                  prop="planConfirmLabel" label="指标" align="left">
                   <template slot-scope="scope">
                         <el-tooltip class="item" effect="dark" :content="indexContent(scope.row.planConfirmLabel)" placement="top">
                          <span>{{ scope.row.planConfirmLabel }}</span>
                        </el-tooltip>
              </template>
                </el-table-column>
            <el-table-column
                v-for="(week, index) in weekDate"
              :label="week" width="120" align="right">
              <template slot-scope="scope">
                  <el-input v-if="scope.row.isInput && scope.row.isInput[index].length !== 0" :disabled="scope.row.isInput && scope.row.isInput[index] !== 1" size="mini" oninput="value=value.replace(/[^\\d.]/g,'')" placeholder="Please input price" :style="{textAlign: 'right'}" v-model="scope.row.qtyList[index]"></el-input>
                  <span v-if="scope.row.type == 1">{{scope.row.qtyList[index] != 0 ? (scope.row.qtyList[index]*100).toFixed(3)+"%" : '-' }}</span>
                  <span v-if="scope.row.type != 1 && scope.row.type != 2">{{scope.row.qtyList[index] != 0 ? scope.row.qtyList[index] : '-' }}</span>
              </template>
            </el-table-column>
        </el-table>
            <div style=";width: 100%;">
                <div style="height: 30px;width: 1px"></div>
                <el-row>
                 <span style="margin-left: 20px">日期范围</span>
                <el-date-picker
                  v-model="value1"
                  @change="changePicker"
                  type="daterange"
                  size="mini"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  align="right"
                  unlink-panels
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  :picker-options="pickerOptions">  
                </el-date-picker>
                <el-select v-model="value2" size="mini" clearable collapse-tags :multiple-limit="4" multiple placeholder="请选择指标" @change="labelChange">
                    <el-option
                      v-for="item in labels"
                      :key="item"
                      :label="item"
                      :value="item">
                    </el-option>
                  </el-select>
                 <el-pagination
                 background
                 @size-change="sizeChangeHandle"
                 @current-change="currentChangeHandle"
                 :current-page="pageIndex"
                 :page-sizes="[10, 20, 30, 50]"
                 :page-size="pageSize"
                 :total="totalCount"
                 :page-count="totalPage"
                  small
                  style="float: right"
                  layout="sizes, prev, pager, next">
                </el-pagination>
                </el-row>
                <div v-loading="echartsLoading" style="margin-top: 20px;height: 30vh;width: 100%;" id="echarts"></div>
            </div>
            </el-card>
        <el-dialog
          center
          :style="{ padding: '0px' }"
          fullscreen
          :show-close="false"
          :visible.sync="dialogVisible1">
           <div style="text-align: right;margin: 5px">
           <el-button  size="small" style="float: left;margin-left: 10px" @click="leaveFullScreen">退出全屏</el-button>
           <el-button size="small" type="primary" style="margin-right: 5px"  @click="choiceAllocationDetail">任务列表</el-button>
           <el-dropdown @command="commandUnit" style="margin-right: 5px;">
                  <el-button  type="info" size="small" style="margin-left: 5px;">
                    {{defaultUnit?defaultUnit:defaultUnitItem.name}}<i class="el-icon-arrow-down el-icon--right"></i></el-button>
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item v-for="item in unitOption" :command="item">{{item.unitName}}</el-dropdown-item>                      
                  </el-dropdown-menu>
                </el-dropdown>
               <el-button size="small"  icon="el-icon-search" type="primary" style="float: right;margin-left: 10px" @click="dialogFormVisible = true">高级搜索</el-button>
           <el-dialog title="高级搜索" style="text-align: left" append-to-body width="70%" :visible.sync="dialogFormVisible">
                    <div>   
                        <el-form :inline="true" label-width="100px" :model="dataForm"  size="small"  class="demo-form-inline">
                        <el-row>
                        <el-form :inline="true" label-width="100px" :model="dataForm"  size="small"  class="demo-form-inline">
                        
                        <el-row>
                              <el-col :span="8">
                              <el-form-item label="区域选择:">
                             <el-cascader
                             ref="tree2"
                            v-model="dataForm.areaCodes"
                            clearable
                            :props="props2"
                            ></el-cascader>
                              </el-form-item>
                              </el-col><el-col :span="8">
                              <el-form-item label="商品选择:">
                                 <el-cascader :props="props1" clearable v-model="dataForm.categoryCodes" ref="tree3" ></el-cascader>
                              </el-form-item>
                              </el-col>
                              <el-col :span="8">
                              <el-form-item label="商品编码:">
                              <el-input type="textarea"
                              :autosize="{ minRows: 1, maxRows: 4}" style="width:210px;" placeholder="请输入商品编码"
                              v-model="dataForm.skuCodeS"
                              clearable></el-input>
                            </el-form-item>
                            </el-col>
                            </el-row>
                            <!--<el-row>
                            <el-col :span="24">
                              <el-form-item label="分层类型:" v-show="dataForm.areaCodes && dataForm.areaCodes.length">
                                    <el-select  style="width:100%" @change="dataForm.layeredCodes = []" v-model="dataForm.randType" clearable placeholder="请选择">
                                        <el-option label="销量分层" value="sale"></el-option>
                                        <el-option label="销售额分层" value="amount"></el-option>
                                    </el-select>
                                </el-form-item>
                                </el-col>
                              <el-col :span="24">
                              <el-form-item label="商品分层:" v-show="dataForm.areaCodes && dataForm.areaCodes.length && dataForm.randType && dataForm.randType.length">
                                <el-checkbox-group v-model="dataForm.layeredCodeList">
                                             <el-checkbox label="A">A</el-checkbox>
                                             <el-checkbox label="B">B</el-checkbox>
                                             <el-checkbox label="C">C</el-checkbox>
                                             <el-checkbox label="D">D</el-checkbox>
                              </el-checkbox-group>
                              </el-form-item>
                              </el-col></el-row>--><el-row>
                              <el-col :span="24">
                                  <el-form-item label="指标选择:">
                                        <el-checkbox-group v-model="dataForm.quota11">
                                        <el-row>
                                            <el-col :span="6"  v-for="item in targetOption">
                                             <el-checkbox :key="item.value" :label="item.value">{{ item.label }}</el-checkbox></el-col>
                                        </el-row>
                                        </el-checkbox-group>
    <!--                                     <el-select  style="width:100%" v-model="dataForm.quota11" clearable  multiple  placeholder="请选择">-->
    <!--                                      <el-option-->
    <!--                                        v-for="item in targetOption"-->
    <!--                                        :key="item.value"-->
    <!--                                        :label="item.label"-->
    <!--                                        :value="item.value">-->
    <!--                                      </el-option>-->
    <!--                                    </el-select>-->
                                  </el-form-item>
                              </el-col>
                              </el-row>
                            
</el-form>
                              </el-col>
                              <!--<el-col :span="8">
                              <el-form-item label="指标选择:">
                                     <el-select  style="width:100%" v-model="dataForm.quota11" clearable  multiple  placeholder="请选择">
                                      <el-option
                                        v-for="item in targetOption"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                      </el-option>
                                    </el-select>
                              </el-form-item>
                              </el-col><el-col :span="8">
                              <el-form-item label="商品编码">
                              <el-input type="textarea"
  :autosize="{ minRows: 1, maxRows: 4}" style="width:210px;" placeholder="请输入商品编码"
  v-model="dataForm.skuCodeS"
  clearable></el-input>
</el-form-item>
</el-col><el-col :span="8">
                                <el-form-item label="分层类型:" v-show="dataForm.areaCodes && dataForm.areaCodes.length">
                                    <el-select  style="width:100%" v-model="dataForm.randType" clearable placeholder="请选择">
                                        <el-option label="销量分层" value="sale"></el-option>
                                        <el-option label="销售额分层" value="amount"></el-option>
                                    </el-select>
                                </el-form-item>
                              </el-col><el-col :span="8">
                              <el-form-item label="商品分层:" v-show="dataForm.randType && dataForm.randType.length">
                                  <el-select  style="width:100%" v-model="dataForm.layeredCodeList" clearable  multiple  placeholder="请选择">
                                      <el-option
                                        label="A"
                                        value="A">
                                      </el-option>
                                      <el-option
                                        label="B"
                                        value="B">
                                      </el-option>
                                      <el-option
                                        label="C"
                                        value="C">
                                      </el-option>
                                      <el-option
                                        label="D"
                                        value="D">
                                      </el-option>
                                    </el-select>
                              </el-form-item>
                              </el-col>-->
                    </el-form>
                </el-row>
                <div style="text-align: center">
                    <span class="dialog-footer">
                    <el-button size="mini" @click="clearCondition">清 除 条 件</el-button>
                    <el-button type="primary" size="mini" @click="searchList">搜 索</el-button>
                  </span>
                </div>
           </div>
                 </el-dialog>
                  <el-button  size="small" @click="saveButton" type="primary" style="margin-right: 5px;">确认</el-button>
                  <el-button size="small" type="primary" style="margin-right: 5px;" @click="dialogVisible3 = true">导入</el-button>
                 <el-dropdown @command="exportExcel">
                      <el-button type="primary"  size="small" >
                        导出<i class="el-icon-arrow-down el-icon--right"></i></el-button>
                      <el-dropdown-menu slot="dropdown">
                        <el-dropdown-item :command="1">当前页数据</el-dropdown-item>
                        <el-dropdown-item :command="2">已勾选数据</el-dropdown-item>
                        <el-dropdown-item :command="3">所有查询结果</el-dropdown-item>
                      </el-dropdown-menu>
                    </el-dropdown>
                 <el-table v-loading="dataListLoading" v-if="dataList.length === 0 "></el-table>
                <el-table
                :data="dataList"
                :span-method="arraySpanMethod"
                center
                ref="tablemax"
                border
                v-loading="dataListLoading"
                v-show="dataList.length"
                highlight-current-rows
                height="85vh"
                @select="selectChange"
                @select-all="selectAllChange"
                :header-row-style="{height: '20px',fontSize: '14px', fontWeight: '700',lineHeight: '36px',textAlign: 'center',backgroundColor: '#f3f4f4',padding: 0}"
                :row-style="{ color: '#999A9A', height: '16px',fontSize: '12px', fontWeight: 400,lineHeight: '26px',textAlign: 'center'}"
                :cell-style="{padding: 0}"
                :header-cell-style="findStyle"
                style="width: 100%;padding: 0"
                :highlight-current-row="false">
            <el-table-column
                    type="selection"
                     fixed="left"
                    width="55">
            </el-table-column>
          
                <el-table-column
                width="130"
                  prop="area"
                  fixed="left"
                  label="区域" align="left">
                   <template slot-scope="scope">
                        {{scope.row.area == null || scope.row.area == '' ? "全国" : scope.row.area}}
                    </template>
                </el-table-column>
                <el-table-column
                  prop="category"
                  width="130"
                  fixed="left"
                  label="品类" align="left">
                </el-table-column>
                <el-table-column
                  prop="skuName"
                  fixed="left"
                  width="130"
                  label="商品" align="left">
                  <template slot-scope="scope">
                      {{scope.row.skuName}}/{{scope.row.skuCode}}
                  </template>
                </el-table-column>
                <el-table-column
                 v-if="infor.status != null"
                  prop="status"
                  width="130"
                  fixed="left"
                  label="门店确认状态" align="left">
                  <template slot-scope="scope">
                      {{scope.row.status == 0 ? '待提交' :  scope.row.status == 10 ? '已暂存' : scope.row.status == 20 ? '已提交' : scope.row.status == 30 ? '已取消' : ''}}
                  </template>
                </el-table-column>
                <el-table-column
                width="130"
                fixed="left"
                  prop="planConfirmLabel" label="指标" align="left">
                  <template slot-scope="scope">
                         <el-tooltip class="item" effect="dark" :content="indexContent(scope.row.planConfirmLabel)" placement="top">
                          <span>{{ scope.row.planConfirmLabel }}</span>
                        </el-tooltip>
              </template>
                </el-table-column>
            <el-table-column
                v-for="(week, index) in weekDate"
              :label="week" width="120" align="right">
              <template slot-scope="scope">
               <el-input v-if="scope.row.isInput && scope.row.isInput[index].length !== 0" :disabled="scope.row.isInput && scope.row.isInput[index] !== 1" size="mini" oninput="value=value.replace(/[^\\d.]/g,'')" placeholder="Please input price" :style="{textAlign: 'right'}" v-model="scope.row.qtyList[index]"></el-input>
                  <span v-if="scope.row.type == 1">{{scope.row.qtyList[index] != 0 ? (scope.row.qtyList[index]*100).toFixed(3)+"%" : '-' }}</span>
                  <span v-if="scope.row.type != 1 && scope.row.type != 2">{{scope.row.qtyList[index] != 0 ? scope.row.qtyList[index] : '-' }}</span>
              </template>
            </el-table-column>
        </el-table>
          <el-pagination
          background
                 @size-change="sizeChangeHandle"
                 @current-change="currentChangeHandle"
                 :current-page="pageIndex"
                 :page-sizes="[10, 20, 30, 50]"
                 :page-size="pageSize"
                 :total="totalCount"
                 :page-count="totalPage"
                  small
                  style="float: right"
                  layout="sizes, prev, pager, next">
                </el-pagination>
           </div>
          <span slot="footer" class="dialog-footer">
          </span>
        </el-dialog>

    </div>
    `
        }
    );
});